<template>
	<view class="contain">
		<!-- 车间选择选择器 -->
		<zy-group :title="$t('homepage.Machine.departChoose')">
			<view class="deptContainer">
				<view v-if="this.$store.state.loginData.username!='admin'">{{deptName}}</view>
				<uni-data-picker :placeholder="$t('public.pleaseSelect')+$t('homepage.Machine.deptName')"
					:popup-title="$t('public.pleaseInput')" :localdata="deptDatas" v-model="deptValue"
					@change="onchange" @popupopened="onpopupopened" v-else>
				</uni-data-picker>
			</view>
		</zy-group>
		<!-- 概况 -->
		<zy-group :title="$t('homepage.Machine.overview')">
			<view class="overview-datas">
				<view class="overview-data">
					<view class="sub">
						{{$t('homepage.Machine.requiredNum')}}
					</view>
					<view class="num">
						<label class="label">{{requiredNum}}</label>{{$t('public.piece')}}
					</view>
				</view>
				<view class="overview-data">
					<view class="sub">
						{{$t('homepage.Machine.realNum')}}
					</view>
					<view class="num">
						<label class="label">{{realNum}}</label>{{$t('public.piece')}}
					</view>
				</view>
				<view class="overview-data">
					<view class="sub">
						{{$t('homepage.Machine.borrowNum')}}
					</view>
					<view class="num">
						<label class="label">{{borrowNum}}</label>{{$t('public.piece')}}
					</view>
				</view>
			</view>
		</zy-group>
		<!-- 设备扫描搜索框 -->
		<zy-group :title="$t('homepage.Machine.machineScan')" v-if="machinePage">
			<search :placeholder="$t('homepage.Machine.machineCode')" :fixed="false" />
		</zy-group>
		<!-- 搜索结果列表 -->
		<zy-group :title="$t('homepage.Machine.list')" v-if="machineCheckPage">
			<zy-table :headList="titleList" :dataList="tableList" border></zy-table>
		</zy-group>
		<!-- 底部按钮 -->
		<bottomBtn fixed :leftText="$t('public.reset')" :rightText="$t('public.submit')" @rightBtn="submitBtn"
			@leftBtn="resetBtn">
		</bottomBtn>
		<!-- 弹出层 -->
		<zy-popup ref="popup" :title="$t('homepage.Machine.InventoryManage')" type="dialog" @confirm="confirm">
			<text style="margin: 20rpx 0;">{{$t('homepage.Machine.isSureSubmit')}}</text>
		</zy-popup>
	</view>
</template>

<script>
	import {
		queryTreeList,
		getCountByDeptId,
		getEntityByCode,
		saveMachineInventory
	} from "@/api/homepage.js"
	export default {
		data() {
			return {
				deptName: this.$store.state.loginData.deptName,
				deptValue: "",
				deptDatas: [],
				deptId: '',
				deptChildTitle: '',
				label: '',
				childArr: [],
				code: '',
				requiredNum: 0,
				realNum: 0,
				borrowNum: 0,
				machinePage: false,
				machineCheckPage: false,
				titleList: [{
						key: 'code',
						name: this.$t('homepage.Machine.machineNo')
					},
					{
						key: 'name',
						name: this.$t('public.name')
					},
					{
						key: 'spec',
						name: this.$t('public.spec')
					},
					{
						key: 'ascription',
						name: this.$t('homepage.Machine.ascription')
					},
				],
				tableList: [],
				machineStr: '',
				machineStrs: [],
			}
		},
		created() {
			if (this.$store.state.loginData.username != 'admin') {
				this.machinePage = true
				this.getData()
			}
		},
		onLoad() {
			//PDA扫描
			var _this = this
			uni.$on('scancodedate', function(data) {
				_this.searchList(data.code)
			})
		},
		onUnload() {
			// 移除监听事件      
			uni.$off('scancodedate')
		},
		methods: {
			// 部门车间选择选择器
			onpopupopened(e) {
				queryTreeList().then((res) => {
					if (res.code == 0) {
						// uniapp级联选择器更换key值
						this.deptDatas = JSON.parse(JSON.stringify(res.data).replace(/id/g, "value").replace(
							/title/g, "text"))
						this.deptDatas.forEach((item) => {
							let children = JSON.parse(JSON.stringify(item.children).replace(/id/g, "value")
								.replace(/title/g, "text"))
						})
					}
				})
			},
			// 部门车间选择确定事件
			onchange(e) {
				console.log(e)
				this.deptValue = e.detail.value[0] + ',' + e.detail.value[1].label
				this.deptId = e.detail.value[e.detail.value.length - 1].value
				this.deptChildTitle = e.detail.value[e.detail.value.length - 1].text
				this.getData()
			},
			getData() {
				if (this.$store.state.loginData.username != 'admin') {
					this.deptId = this.$store.state.loginData.deptId
					this.deptName = this.$store.state.loginData.deptName
				} else {
					this.deptId = this.deptId
					this.deptName = this.deptChildTitle
				}
				//确认返回应盘点数数据
				getCountByDeptId({
					deptId: this.deptId, //部门id
					deptName: this.deptName, //部门名称
				}).then((res) => {
					if (res.code == 0) {
						this.machinePage = true
						console.log(res)
						this.requiredNum = res.data
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
			searchList(e) {
				getEntityByCode({
					code: e,
				}).then((res) => {
					if (res.code == 0) {
						this.machineCheckPage = true
						//列表数据
						const item = res.data
						let obj = {}
						obj.id = item.id
						obj.code = item.code
						obj.name = item.name
						obj.spec = item.spec
						if (item.deptId == this.deptId) {
							obj.ascription = this.$t('homepage.Machine.thisDepartment')
							obj.ascriptionId = "0"
						} else {
							obj.ascription = this.$t('homepage.Machine.borrow')
							obj.ascriptionId = "1"
						}
						if (res.data.deptId == this.deptId) {
							if (this.tableList.length == 0) {
								this.$nextTick(() => {
									this.tableList.push(obj)
								})
								//查询一次实际数量加一
								this.realNum++
							} else {
								if (this.tableList.findIndex(item => item.code === e) !== -1) {
									uni.showToast({
										title: this.$t('public.searchRepeat'),
										icon: "none",
										duration: 3000
									})
								} else {
									this.tableList.push(obj)
									//查询一次实际数量加一
									this.realNum++
								}
							}
						} else {
							if (res.data.status == '4') {
								if (this.tableList.length == 0) {
									this.tableList.push(obj)
									//查询一次实际数量加一
									this.realNum++
									//status为4借入数量加一 
									this.borrowNum++
								} else {
									if (this.tableList.findIndex(item => item.code === e) !== -1) {
										uni.showToast({
											title: this.$t('public.searchRepeat'),
											icon: "none",
											duration: 3000
										})
									} else {
										this.tableList.push(obj)
										//查询一次实际数量加一
										this.realNum++
										//status为4借入数量加一
										this.borrowNum++
									}
								}
							} else {
								uni.showToast({
									title: this.$t('homepage.Machine.errorMachinedBorrow'),
									icon: "none",
									duration: 3000
								})
							}
						}
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
			//提交
			submitBtn() {
				this.$refs.popup.open()
			},
			//确认提交
			confirm() {
				for (var i = 0; i < this.tableList.length; i++) {
					this.machineStrs += this.tableList[i].id + ':' + this.tableList[i].ascriptionId + ','
				}
				this.machineStrs = this.machineStrs.substring(0, this.machineStrs.lastIndexOf(","))
				if (this.$store.state.loginData.username != 'admin') {
					this.deptId = this.$store.state.loginData.deptId
					this.deptName = this.$store.state.loginData.deptName
				} else {
					this.deptId = this.deptId
					this.deptName = this.deptChildTitle
				}
				saveMachineInventory({
					machineStr: this.machineStrs,
					theoryNum: this.requiredNum,
					actualNum: this.realNum,
					borrowNum: this.borrowNum,
					deptId: this.deptId, //部门id
					deptName: this.deptName, //部门名称
				}).then((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
					this.resetBtn()
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
			//页面重置刷新
			resetBtn() {
				uni.redirectTo({
					url: "/pages/HomePage/Machine/InventoryManage/depart"
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.deptContainer {
		padding: 30rpx 20rpx;
	}

	.contain {
		margin: 5px 0;
	}

	.container {
		background-color: #FFFFFF;
		height: 95px;
		width: 100%;
		border-bottom: 1px solid #F6F7FB;
	}

	.title {
		padding: 10px 10px 0 10px;

		.text {
			color: #ffaa00;
			border-left: 5px solid #ffaa00;
			padding-left: 5px;
		}
	}

	.pickerName {
		padding-top: 8px;
		font-weight: 800;
	}

	.picker-input {
		width: 90%;
		margin: 10px auto 0 auto;
	}

	.overview-datas {
		display: flex;
		text-align: center;
		font-size: 14px;
		width: 100%;

		.overview-data {
			width: 33.3%;
			margin: 10px 0;
		}

		.sub {
			font-weight: 800;
			letter-spacing: 1px;
			margin-bottom: 5px;
		}

		.num {
			font-size: 16px;
			text-align: center;
			color: #ccc;
		}

		.label {
			padding: 5px;
			color: red;
		}
	}

	.operationSet {
		width: 100%;
		margin-bottom: 50px;
		background-color: #FFFFFF;
		border-bottom: 1px solid #F6F7FB;

		.operationSet-table {
			margin: 10px 0;
		}
	}
</style>